<template>
  <div class="app-container">
    <!-- 主表查询和其他操作 -->
    <el-form :inline="true" class="demo-form-inline">
      <el-form-item label="预约日期">
         <el-date-picker
          v-model="alarmdate"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"/>
      </el-form-item>

      <el-form-item label="单号">
        <el-input
          v-model="listQuery.fbillno"
          clearable
          class="filter-item"
          style="width: 200px"
          placeholder="请输入单号"
        />
      </el-form-item>
      <el-form-item label="状态">
        <el-select
        disabled
          v-model="listQuery.fbillstate"
          class="filter-item"
          style="width: 200px"
          clearable
          placeholder="请选择状态"
        >
          <el-option
            v-for="item in fbillstateOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
       <el-form-item label="客户名称">
        <el-select disabled clearable filterable v-model="listQuery.fsiteNo" class="filter-item" placeholder="请选择客户名称">
                <el-option
                v-for="item in getListfsiteNo"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
              </el-select>
      </el-form-item>
       <el-form-item label="预约人员">
               <div style="width: 220px;display:flex;justify-content:flex-end;align-items:center">
                <el-select style="display: inline-block;width:200px" clearable filterable v-model="listQuery.fuseuser" class="filter-item" placeholder="请选择预约人员">
                <el-option
                v-for="item in getListfuseuser"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
              </el-select>
                <i style="display: inline-block;width:20px;color:#409EFF;margin-left:3px" class="el-icon-search" @click="searchDialog('search')"/>
              </div>
      </el-form-item>
      <el-form-item label="预约地点">
              <div style="width: 220px;display:flex;justify-content:flex-end;align-items:center">
                 <el-select style="display: inline-block;width:200px" clearable filterable v-model="listQuery.fpointNo" class="filter-item" placeholder="请选择预约地点">
                <el-option
                v-for="item in getListfpointNo"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
              </el-select>
                <i style="display: inline-block;width:20px;color:#409EFF;margin-left:3px" class="el-icon-search" @click="searchDialoglab('search')"/>
              </div>
      </el-form-item>
      <el-form-item>
        <!-- v-permission="['equipmentUse:useHead:read']" -->
        <el-button
        round size="medium"
          class="filter-item"
          :style="{background:buttonColor.lookup,color:buttonColor.color}"
          icon="el-icon-search"
          @click="handleFilter"
          >查找</el-button
        >
      </el-form-item>
    </el-form>

    <!-- 主表查询结果 -->
    <el-table
      v-loading="listLoading"
      :data="list"
      stripe
      element-loading-text="正在查询中。。。"
      border
      fit
      highlight-current-row
      :header-cell-style="tableColor"
    >
      <el-table-column
        :index="indexMethod"
        align="center"
        label="序"
        type="index"
      />
      <el-table-column align="center" label="单号" prop="fbillno" width="150" />
      <el-table-column :formatter="formatfpointNo" align="center" label="预约地点" prop="fpointNo" />
      <el-table-column :formatter="formatfuseuser" align="center" label="预约人员" prop="fuseuser" />
       <el-table-column
        width="100"
        :formatter="datetimeFormat"
        align="center"
        label="预约日期"
        prop="fusedate"
      />
      <el-table-column
        width="100"
        :formatter="datetimeFormat"
        align="center"
        label="实验日期"
        prop="fplanusedate"
      />

      <el-table-column
        :formatter="timeFormat"
        align="center"
        label="开始时间"
        prop="fplanbegtime"
      />
      <el-table-column
        :formatter="timeFormat"
        align="center"
        label="结束时间"
        prop="fplanendtime"
      />
      <el-table-column align="center" label="人数" prop="fmancount" />
      <el-table-column align="center" label="预约状态" prop="fbillstate">
        <template slot-scope="scope">
          <el-tag effect="dark" type='success'>{{ scope.row.fbillstate | siteTypeFilter }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        label="操作"
        class-name="small-padding"
        width="220"
      >
        <template slot-scope="scope">
          <el-button
            :style="{background:buttonColor,examine:buttonColor.color}"
            round size="small"
            class="button-margin"
            @click="handleUpdate(scope.row)"
            >确认</el-button
          >

          <el-button :style="{background:buttonColor.print,color:buttonColor.color}" round size="small" class="button-margin"
            >打印</el-button
          >
          <!-- v-permission="['equipmentUse:useHead:delete']" -->
          <el-button
            :style="{background:buttonColor.delete,color:buttonColor.color}"
            round size="small"
            class="button-margin"
            @click="updateDataDelete(scope.row)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="listQuery.page"
      :limit.sync="listQuery.limit"
      @pagination="getList"
    />

    <!-- 主表添加或修改对话框 -->
    <el-dialog
      width="auto"
      top="2vh"
      :close-on-click-modal="false"
      :title="textMap[dialogStatus]"
      :visible.sync="dialogFormVisible"
    >
      <el-form
        ref="dataForm"
        :rules="rules"
        :model="dataForm"
        status-icon
        label-position="left"
        label-width="auto"
      >
        <el-row>
          <el-col :span="8">
            <el-form-item label="单号" prop="fbillno">
              <el-input :disabled="true" v-model="dataForm.fbillno" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="预约日期" prop="fusedate">
              <el-date-picker :disabled="true" v-model="dataForm.fusedate" type="date" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item
              label="预约状态"
              prop="fbillstate"
            >
              <el-select
              :disabled="true"
                v-model="dataForm.fbillstate"
                clearable
                placeholder="请选择预约状态"
              >
                <el-option
                  v-for="item in fbillstateOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8">
            <el-form-item label="客户名称" prop="fsiteNo">
              <el-select :disabled='true' clearable filterable v-model="dataForm.fsiteNo" class="filter-item" placeholder="请选择客户名称">
                <el-option
                v-for="item in getListfsiteNo"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
              </el-select>
            </el-form-item>
          </el-col>
            <el-col :span="8">
            <el-form-item label="预约地点" prop="fpointNo">
                 <el-select disabled clearable filterable v-model="dataForm.fpointNo" class="filter-item" placeholder="请选择预约地点">
                <el-option
                v-for="item in getListfpointNo"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="预约人员" prop="fuseuser">
                <el-select disabled clearable filterable v-model="dataForm.fuseuser" class="filter-item" placeholder="请选择预约人员">
                <el-option
                v-for="item in getListfuseuser"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8">
            <el-form-item
              label="实验日期"
              prop="fplanusedate"
              style="width: 320px"
            >
              <el-date-picker :disabled='true' v-model="dataForm.fplanusedate" type="date" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item
              label="开始时间"
              prop="fplanbegtime"
            >
              <el-date-picker
                v-model="dataForm.fplanbegtime"
                placeholder="开始时间"
                type="datetime"
                :disabled='true'
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item
              label="结束时间"
              prop="fplanendtime"
              :disabled='true'
            >
              <el-date-picker
              :disabled='true'
                v-model="dataForm.fplanendtime"
                placeholder="结束时间"
                type="datetime"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="16">
            <el-form-item
              label="实验说明"
              prop="fexplanation"
            >
              <el-input :disabled="true" v-model="dataForm.fexplanation" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="总人数" prop="fmancount">
              <el-input :disabled="true" v-model.number="dataForm.fmancount" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <el-tabs type="border-card">
        <el-tab-pane label="设备列表">
          <div class="app-container">

            <!-- 子表查询结果 -->
            <el-table
              v-loading="listLoading"
              :data="dataForm.details"
              stripe
              element-loading-text="正在查询中。。。"
              border
              fit
              highlight-current-row
              :header-cell-style="tableColor"
              height="20vh"
            >
              <el-table-column
                align="center"
                label="行号"
                prop="fline"
              />
               <el-table-column align="center" label="固定资产码" prop="fequipmentbarcode" />
              <el-table-column align="center" label="设备标签" prop="fequipmenttag" />
              <el-table-column align="center" :formatter="formatfaction" label="控制指令" prop="faction" />
            </el-table>
          </div>
        </el-tab-pane></el-tabs
      >

      <div slot="footer" class="dialog-footer">
        <el-button :style="{background:buttonColor.cancel,color:buttonColor.colorone}" @click="cancel()">取消</el-button>
        <el-button
          type="primary"
          @click="updateDataAgree"
          >同意</el-button
        >
      </div>
    </el-dialog>
    <!-- 预约地点搜索弹出框 -->
    <el-dialog
      :close-on-click-modal="false"
      :visible.sync="searchVisiblelab"
      top="5vh"
      title="搜索"
    >
      <el-form :inline="true" class="demo-form-inline">
        <el-form-item label="预约地点">
          <el-input
            v-model="listQuerySearchlab.fpointName"
            clearable
            class="filter-item"
            style="width: 150px"
            placeholder="请输入预约地点"
          />
        </el-form-item>
        <el-form-item>
          <el-button
            round
            size="medium"
            class="filter-item"
            :style="{background:buttonColor.lookup,color:buttonColor.color}"
            icon="el-icon-search"
            @click="searchFilterlab"
          >查找</el-button
          >
        </el-form-item>
      </el-form>

      <!-- 查询结果 -->
      <el-table
        v-loading="listLoadingSearchlab"
        :data="searchListlab"
        :header-cell-style="tableColor"
        stripe
        element-loading-text="正在查询中。。。"
        border
        fit
        highlight-current-row
        height="300"
      >
        <el-table-column align="center" label="预约地点" prop="fpointName" />
        <el-table-column
          align="center"
          label="选择"
          class-name="small-padding"
        >
          <template slot-scope="scope">
            <el-button
              :style="{background:buttonColor.confirm,color:buttonColor.color}"
              round
              size="small"
              class="button-margin"
              @click="searchDatalab(scope.row)"
            >确定</el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <pagination
        v-show="totalSearchlab > 0"
        :total="totalSearchlab"
        :page.sync="listQuerySearchlab.page"
        :limit.sync="listQuerySearchlab.limit"
        style="padding:14px 10px !important"
        @pagination="getSearchListlab"
      />
    </el-dialog>

    <!-- 人员搜索弹出框 -->
    <el-dialog
      :close-on-click-modal="false"
      :visible.sync="searchVisible"
      top="5vh"
      title="搜索"
    >
      <el-form :inline="true" class="demo-form-inline">
        <el-form-item label="人员">
          <el-input
            v-model="listQuerySearch.username"
            clearable
            class="filter-item"
            style="width: 150px"
            placeholder="请输入人员"
          />
        </el-form-item>
        <el-form-item>
          <el-button
            round
            size="medium"
            class="filter-item"
            :style="{background:buttonColor.lookup,color:buttonColor.color}"
            icon="el-icon-search"
            @click="searchFilter"
          >查找</el-button
          >
        </el-form-item>
      </el-form>

      <!-- 查询结果 -->
      <el-table
        v-loading="listLoadingSearch"
        :data="searchList"
        :header-cell-style="tableColor"
        stripe
        element-loading-text="正在查询中。。。"
        border
        fit
        highlight-current-row
        height="300"
      >
        <el-table-column align="center" label="账号" prop="id" />
        <el-table-column align="center" label="人员" prop="username" />
        <el-table-column
          align="center"
          label="选择"
          class-name="small-padding"
        >
          <template slot-scope="scope">
            <el-button
             :style="{background:buttonColor.confirm,color:buttonColor.color}"
              round
              size="small"
              class="button-margin"
              @click="searchData(scope.row)"
            >确定</el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <pagination
        v-show="totalSearch > 0"
        :total="totalSearch"
        :page.sync="listQuerySearch.page"
        :limit.sync="listQuerySearch.limit"
        style="padding:14px 10px !important"
        @pagination="getSearchList"
      />
    </el-dialog>

  </div>
</template>

<style>
.button-margin {
  margin: 2px 0px;
}
.el-button + .el-button {
  margin-left: 1px;
}
</style>

<script>
import {
  listuseHead,
  updateuseHead,
} from "@/api/useHead";
import { getListArea,fsiteOptionsByLevel } from '@/api/area'
import Pagination from "@/components/Pagination";
import moment from "moment";
import { tableColor,buttonColor } from "@/filters/index";
import { listRoom } from '@/api/room'
import { listAdmin } from '@/api/admin'

const siteTypeMap = {
  1: "预约中",
  2: "已批准",
  3: "不核准",
  8: "已取消",
};

export default {
  name: "STcExamination",
  components: { Pagination },
  filters: {
    siteTypeFilter(type) {
      return siteTypeMap[type];
    },
  },
  data() {
    return {
      buttonColor:buttonColor,
      getListfactionAll:[],
      selectListlab:[],
      searchVisiblelab: false,
      searchListlab: null,
      listLoadingSearchlab: true,
      totalSearchlab: 0,
      listQuerySearchlab: {
        page: 1,
        limit: 20,
        fpointName: undefined,
        sort: 'create_time',
        order: 'desc'
      },

      searchFlag:'',
      searchFlaglab:'',

       selectList:[],
      searchVisible: false,
      searchList: null,
      listLoadingSearch: true,
      totalSearch: 0,
      listQuerySearch: {
        page: 1,
        limit: 20,
        username: undefined,
        sort: 'create_time',
        order: 'desc'
      },

      getListfsiteNo:null,
      getListfuseuser:null,
      getListfpointNo:null,
      getListfdictno:null,
      list: null,
      total: 0,
      listLoading: true,
      alarmdate: null,
      listQuery: {
        page: 1,
        limit: 20,
        fsiteNo: undefined,
        fuseuser: undefined,
        fusedate: undefined,
        ftakedateStart: undefined,
        ftakedateEnd: undefined,
        fplanusedate: undefined,
        fpointNo: undefined,
        fmancount: undefined,
        fplanbegtime: undefined,
        fplanendtime: undefined,
        frealbegtime: undefined,
        frealendtime: undefined,
        fexplanation: undefined,
        faudituser: undefined,
        fauditdate: undefined,
        fauditnote: undefined,
        fupddate: undefined,
        foperator: undefined,
        fcheckdate: undefined,
        fcheckuser: undefined,
        fbillstate: 1,
        sort: "create_time",
        order: "desc",
      },
      dataForm: {
        fsiteNo: undefined,
        fuseuser: undefined,
        fusedate: undefined,
        fplanusedate: undefined,
        fpointNo: undefined,
        fmancount: undefined,
        fplanbegtime: undefined,
        fplanendtime: undefined,
        frealbegtime: undefined,
        frealendtime: undefined,
        fexplanation: undefined,
        faudituser: undefined,
        fauditdate: undefined,
        fauditnote: undefined,
        fupddate: undefined,
        foperator: undefined,
        fcheckdate: undefined,
        fcheckuser: undefined,
        fbillstate: undefined,
        id: undefined,
        details: [],
      },
      actionsTmp: [],
      dialogFormVisible1: false,
      dialogStatus1: "",
      dataForm1: {},

      dialogFormVisible: false,
      dialogStatus: "",
      textMap: {
        update: "编辑",
        create: "创建",
      },
      tableColor: tableColor,
      rules: {
        fsiteNo: [{ required: true, message: "客户名称不能为空" }],
        fuseuser: [{ required: true, message: "预约人员不能为空" }],
        fusedate: [{ required: true, message: "预约日期不能为空" }],
        fplanusedate: [],
        fpointNo: [{ required: true, message: "教室编号不能为空" }],
        fmancount: [
          {
            type: "number",
            message: "人数必须为数字值",
            transform: (value) => Number(value),
          },
        ],
        fplanbegtime: [],
        fplanendtime: [],
        frealbegtime: [],
        frealendtime: [],
        fexplanation: [],
        faudituser: [],
        fauditdate: [],
        fauditnote: [],
        fupddate: [],
        foperator: [],
        fcheckdate: [],
        fcheckuser: [],
        fbillstate: [
          {
            type: "number",
            message: "单据状态必须为数字值",
            transform: (value) => Number(value),
          },
        ],
      },
      rules1: {
        fdictname: [{ required: true, message: "设备名称不能为空" }],
        fdictno: [
          { required: true, message: "设备类型编号不能为空" },
          {
            type: "number",
            message: "设备类型编号必须为数字值",
            transform: (value) => Number(value),
          },
        ],
        faction: [{ required: true, message: "控制指令不能为空" }],
      },
      fbillstateOptions: [
        { value: 1, label: "预约中" },
        { value: 2, label: "已批准" },
        { value: 3, label: "不核准" },
        { value: 8, label: "已取消" },
      ],
    };
  },
  created() {
    this.listQuery.fsiteNo = this.$store.state.user.fsiteNo;
   this.alarmdate = [this.parserDate(moment(new Date().setDate(1)).format('YYYY-MM-DD')), new Date()]
    this.getList();
    // 用户名称
    fsiteOptionsByLevel(3)
      .then(response => {
        this.getListfsiteNo = response.data.data.list
      })
      .catch(() => {
        this.getListfsiteNo = []
      })
    getListArea({flag:1})
      .then(response => {
        this.getListfdictno = response.data.data.list
      })
      .catch(() => {
        this.getListfdictno = []
      })
      // 预约地点
      this.getSearchListlab()
       getListArea({flag:10,arg1:this.$store.state.user.fsiteNo})
      .then(response => {
        this.getListfpointNo = response.data.data.list
      })
      .catch(() => {
        this.getListfpointNo = []
      })

      // 人员弹出框
      this.getSearchList()
      getListArea({flag:13,arg1:this.$store.state.user.fsiteNo})
      .then(response => {
        this.getListfuseuser = response.data.data.list
      })
      .catch(() => {
        this.getListfuseuser = []
      })

       // 获取全部控制指令
      getListArea({flag:25})
      .then(response => {
        this.getListfactionAll = response.data.data.list
      })
      .catch(() => {
        this.getListfactionAll = []
      })

  },
  methods: {
    parserDate(date) {
      var t = Date.parse(date)
      if (!isNaN(t)) {
        return new Date(Date.parse(date.replace(/-/g, '/')))
      }
    },
     // 人员弹出框
    getSearchList() {
      this.listLoadingSearch = true
        const templ={
          fsiteNoBelong:this.$store.state.user.fsiteNo,
          page:this.listQuerySearch.page,
           limit:this.listQuerySearch.limit,
           sort: 'create_time',
           order: 'desc',
           username:this.listQuerySearch.username,
        }
       listAdmin(templ)
      .then(response => {
        this.searchList = response.data.data.list
        this.totalSearch = response.data.data.total
          this.listLoadingSearch = false
      })
      .catch(() => {
        this.searchList = []
        this.totalSearch = 0
          this.listLoadingSearch = false
      })

    },

    // 人员弹出框
    searchFilter() {
      this.listQuerySearch.page = 1
      this.getSearchList()
    },

    // 人员弹出框
    searchData(row) {
      this.searchVisible = false
      if(this.searchFlag==='add'){
      this.dataForm.fuseuser = row.id.toString()
      }else{
      this.listQuery.fuseuser = row.id.toString()
      }
    },

    // 人员弹出框
    searchDialog(data) {
      if(data==='add'){
        this.searchFlag = 'add'
      }else{
        this.searchFlag = 'search'
      }
      this.searchVisible = true
    },

    // 预约地点获取搜索列表
    getSearchListlab() {
      this.listLoadingSearchlab = true
      const temp = {
        fsiteNo:this.$store.state.user.fsiteNo,
        fpointFlag:0,
        page:this.listQuerySearchlab.page,
        limit:this.listQuerySearchlab.limit,
        sort: 'create_time',
        order: 'desc',
        fpointName:this.listQuerySearchlab.fpointName,
      }

       listRoom(temp)
      .then(response => {
        this.searchListlab = response.data.data.list
        this.totalSearchlab = response.data.data.total
          this.listLoadingSearchlab = false
      })
      .catch(() => {
        this.searchListlab = []
        this.totalSearchlab = 0
          this.listLoadingSearchlab = false
      })

    },


    // 预约地点获取搜索列表
    searchFilterlab() {
      this.listQuerySearchlab.page = 1
      this.getSearchListlab()
    },
    // 预约地点获取搜索列表
    searchDatalab(row) {
      this.searchVisiblelab = false
      if(this.searchFlaglab==='add'){
      this.dataForm.fpointNo = row.fpointNo
      }else{
        this.listQuery.fpointNo = row.fpointNo
      }
    },

    // 预约地点获取搜索列表
    searchDialoglab(data) {
       if(data==='add'){
        this.searchFlaglab = 'add'
      }else{
        this.searchFlaglab = 'search'
      }
      this.searchVisiblelab = true
    },

    formatflevelno: function(row, column) {
      if(this.getListfdictno){
        for (let i = 0; i < this.getListfdictno.length; i++) {
        if (row.fdictno === this.getListfdictno[i].value) {
          return this.getListfdictno[i].label
        }
      }
      return ''
      }else{
      return ''
      }
    },
    formatfpointNo: function(row, column) {
      if(this.getListfpointNo){
        for (let i = 0; i < this.getListfpointNo.length; i++) {
        if (row.fpointNo === this.getListfpointNo[i].value) {
          return this.getListfpointNo[i].label
        }
      }
      return ''
      }else{
      return ''
      }
    },
    formatfuseuser: function(row, column) {
      if(this.getListfuseuser){
        for (let i = 0; i < this.getListfuseuser.length; i++) {
        if (row.fuseuser === this.getListfuseuser[i].value) {
          return this.getListfuseuser[i].label
        }
      }
      return ''
      }else{
      return ''
      }
    },

    formatfaction: function(row, column) {
      if(this.getListfactionAll){
        for (let i = 0; i < this.getListfactionAll.length; i++) {
        if (row.faction == this.getListfactionAll[i].value) {
          return this.getListfactionAll[i].label
        }
      }
      return ''
      }else{
      return ''
      }
    },

    datetimeFormat(row, column) {
      const date = row[column.property];
      if (date === undefined || date === null) {
        return "";
      }
      return moment(date).format("YYYY-MM-DD");
    },
    timeFormat(row, column) {
      const date = row[column.property];
      if (date === undefined || date === null) {
        return "";
      }
      return moment(date).format("HH:mm:ss");
    },
    formatDate: function(date) {
      if(typeof(date)==='object'){
         var ym
      var y = date.getFullYear()
      var m = date.getMonth() + 1
      var d = date.getDate()
      if (m < 10) {
        m = '0' + m
      }
      if (d < 10) {
        d = '0' + d
      }
      ym = '' + y + m + d
      return ym
      }else{
        return date
      }

    },
    getList() {
      this.listQuery.ftakedateStart = this.alarmdate == null ? null : this.formatDate(this.alarmdate[0])
      this.listQuery.ftakedateEnd = this.alarmdate == null ? null : this.formatDate(this.alarmdate[1])
      this.listLoading = true;
      listuseHead(this.listQuery)
        .then((response) => {
          this.list = response.data.data.list;
          this.total = response.data.data.total;
          this.listLoading = false;
        })
        .catch(() => {
          this.list = [];
          this.total = 0;
          this.listLoading = false;
        });
    },
    handleFilter() {
      this.listQuery.page = 1;
      this.getList();
    },
    resetForm() {
      this.dataForm = {
        fsiteNo: undefined,
        fuseuser: undefined,
        fusedate: undefined,
        fplanusedate: undefined,
        fpointNo: undefined,
        fmancount: undefined,
        fplanbegtime: undefined,
        fplanendtime: undefined,
        frealbegtime: undefined,
        frealendtime: undefined,
        fexplanation: undefined,
        faudituser: undefined,
        fauditdate: undefined,
        fauditnote: undefined,
        fupddate: undefined,
        foperator: undefined,
        fcheckdate: undefined,
        fcheckuser: undefined,
        fbillstate: undefined,
        id: undefined,
        details: [],
      };
    },
    handleUpdate(row) {
      this.actionsTmp = [];
      row.details.forEach((v) => {
        this.actionsTmp.push(v);
      });

      this.dataForm = Object.assign({}, row);
      this.dialogStatus = "update";
      this.dialogFormVisible = true;
      this.$nextTick(() => {
        this.$refs["dataForm"].clearValidate();
      });
    },
    updateDataDelete(row){
       this.$confirm("是否要删除预约", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.dataForm=row
       this.dataForm.fbillstate=8
       this.dataForm.foperator=this.$store.state.user.id
          this.dataForm.fupddate=new Date()
       updateuseHead(this.dataForm, this.$route.query.id)
            .then(() => {
              this.getList()
              this.dialogFormVisibleAudit = false;
              this.$notify.success({
                title: "成功",
                message: "删除成功",
              });
            })
            .catch((response) => {
              this.$notify.error({
                title: "失败",
                message: response,
              });
            });

     });
    },
    updateDataAgree() {
     this.dataForm.fbillstate=2
     this.dataForm.foperator=this.$store.state.user.id
          this.dataForm.fupddate=new Date()
          updateuseHead(this.dataForm, this.$route.query.id)
            .then(() => {
             this.getList()
              this.dialogFormVisible = false;
              this.$notify.success({
                title: "成功",
                message: "确认成功",
              });
            })
            .catch((response) => {
              this.$notify.error({
                title: "失败",
                message: response,
              });
            });

    },
    indexMethod(index) {
      index = index + 1;
      return index;
    },
    cancel() {
      this.dialogFormVisible = false;
      this.list.forEach((v) => {
        if (v.fbillno === this.dataForm.fbillno) {
          this.dataForm.details = this.actionsTmp;
          const index = this.list.indexOf(v);
          this.list.splice(index, 1, this.dataForm);
          return;
        }
      });
    },
  },
};
</script>
